Currently, there's no clean way to reference global animation names in CSS Modules. This causes friction when:

• Using animation libraries (like Animate.css)
• Working with design systems that define animations globally

The new postcss-modules-local-by-default version 4.1.0 adds a clean syntax:

.component {
  animation: global(fadeIn) 0.5s ease-in;
  animation-name: global(fadeIn);
}

For more information see css-modules/postcss-modules-local-by-default#75

How?

• Updates postcss-modules-local-by-default from 4.0.4 to 4.1.0
• The new version adds support for global() function specifically for animation names
• Only affects animation name localization, leaving other properties untouched

Testing

The functionality is tested in the postcss-modules-local-by-default package: https://github.com/css-modules/postcss-modules-local-by-default/blob/39a2f78d9f39f5c0e30dd9b2a25f4a145431cb20/test/index.test.js#L187-L243